.zoom-close {
  animation-name: zoom-close;
  animation-duration: 500ms;
  animation-timing-function: ease-in;
  animation-fill-mode: forwards;
}

@keyframes zoom-close {
  from {
    transform: scale(1);
    opacity: 1;
    filter: blur(0px);
  }
  to {
    transform: scale(5);
    opacity: 0;
    filter: blur(50px);
  }
}

.zoom-open {
  animation-name: zoom-open;
  animation-duration: 500ms;
  animation-timing-function: ease-in;
  animation-fill-mode: forwards;
}

@keyframes zoom-open {
  from {
    transform: scale(5);
    opacity: 0;
    filter: blur(50px);
  }
  to {
    transform: scale(1);
    opacity: 1;
    filter: blur(0px);
  }
}
